<template>
	<view>
		<template v-if="pageType=='bjSearch'">
			<view class="usInfoTop " v-if="pageData">
				<view class="p1">估算价格</view>
				<view class="p2 mb10">
					<text>{{pageData.totalPrice}}</text>
					<text>元</text>
				</view>
				<view class="flex flex-y-center flex-x-center p3 mb20">
					<image class="mr10" src="@/static/images/bts.png" mode="widthFix"></image>
					<text>如有问题请联系区域负责人</text>
				</view>
				<view class="flex flex-y-center nav">
					<view class="item flex flex-column flex-y-center flex-x-center">
						<text>{{pageData.unitPrice}}元/㎡</text>
						<text>单价</text>
					</view>
					<view class="item flex flex-column flex-y-center flex-x-center">
						<text>{{pageData.galssArea}}㎡</text>
						<text>总面积</text>
					</view>
				</view>
			</view>
			<view style="padding:  30rpx;" v-if="pageData">
				<view class="gsList">
					<view class="p1">{{pageData.glassType}}</view>
					<!-- <view class="p2">玻璃品种：超白/10mm</view>
					<view class="p2">中空：无</view>
					<view class="p2">夹胶：无</view> -->
					<view class="p2">附加条件：{{pageData.tenantId||'暂无'}}</view>
					<view class="p2">数量：{{pageData.count}}个</view>
					<view class="p2">宽*高：{{pageData.widthLimit}}*{{pageData.heightLimit}}mm</view>
					<view class="flex flex-y-center flex-x-between bot">
						<text>面积：{{pageData.galssArea}}㎡ </text>
						<text class="red">￥{{pageData.unitPrice}}</text>
					</view>
				</view>
			</view>
		</template>
		<view style="padding:  30rpx;" v-if="pageType=='gsList'">
			<view class="gsList mb30" v-for="item in dataList">
				<view class="p1">{{item.glassType}}</view>
				<view class="p2">附加条件：{{item.tenantId||'暂无'}}</view>
				<view class="p2">数量：{{item.count}}个</view>
				<view class="p2">宽*高：{{item.widthLimit}}*{{item.heightLimit}}mm</view>
				<view class="flex flex-y-center flex-x-between bot">
					<text>面积：{{item.galssArea}}㎡ </text>
					<text class="red">￥{{item.unitPrice}}</text>
				</view>
			</view>
			<noData v-if="dataList.length<=0"></noData>
			<uni-load-more v-else :status="sendData.status"></uni-load-more>
		</view>

	</view>
</template>

<script setup>
	import config from '@/common/config.js'
	import {
		ref
	} from 'vue'
	import {
		inquiryList
	} from "@/api/index.js";
	const pageData = ref(null);
	const pageType = ref('');
	const dataList = ref([]);
	const sendData = ref({
		status: 'more',
		pageSize: 10,
		pageNum: 1,
	})
	onLoad((opt) => {
		pageType.value = opt.pageType
		if (opt.pageType == 'bjSearch') {
			pageData.value = JSON.parse(opt.pageData)
		}
		if (opt.pageType == 'gsList') {
			getList();
		}
	})
	const getList = (isRoll) => {
		// isRoll 是否滚动加载
		if (!isRoll) {
			sendData.value.pageNum = 1;
		}
		inquiryList({
			pageNum: sendData.value.pageNum,
			pageSize: sendData.value.pageSize
		}).then((res) => {
			if (res.code == 200) {
				dataList.value = res.rows;
				dataList.value = isRoll ? dataList.value.concat(res.rows) : res.rows;
			}
			console.log(res.rows.length);
			console.log(res.rows.length < sendData.value.pageSize);
			if (res.rows.length < sendData.value.pageSize) {
				sendData.value.status = "noMore";
			}
		})
	}
	onReachBottom(() => {
		if (sendData.value.status == "noMore") return;
		sendData.value.pageNum += 1;
		getList(true);
	})
</script>

<style lang="scss" scoped>
	.usInfoTop {
		width: 100%;
		height: 340rpx;
		background-image: linear-gradient(to right, #F6AD00, #E60619);
		color: #fff;

		.p1 {
			line-height: 120rpx;
			font-size: 36rpx;
			text-align: center;
		}

		.p2 {
			font-size: 20rpx;
			text-align: center;

			text:nth-child(1) {
				font-size: 40rpx;
				font-weight: 600;
			}
		}

		.p3 {
			font-size: 26rpx;

			image {
				width: 32rpx;
				height: 32rpx;
			}
		}

		.nav {
			.item {
				width: 50%;
				font-size: 30rpx;
				position: relative;
			}

			.item:nth-child(1):before {
				position: absolute;
				right: 0;
				content: "";
				width: 1px;
				height: 100%;
				background-color: #fff;
			}
		}
	}

	.gsList {
		width: 100%;
		color: #555;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
		border-radius: 10rpx;
		padding: 30rpx 30rpx 10rpx 30rpx;
		box-sizing: border-box;
		font-size: 32rpx;
		line-height: 70rpx;

		.p1 {
			font-size: 36rpx;
			font-weight: 600;
		}

		.bot {
			height: 88rpx;
			border-top: 1px solid #EEE;

			.red {
				color: #E60619;
				font-weight: 600;
			}
		}
	}
</style>